/* --------------- Global --------------- */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

a:active {
  color: inherit;
}

a:visited {
  color: inherit;
}

a:link {
  color: inherit;
  text-decoration: none;
}

/* --------------- Sections --------------- */
.content_section {
  width: 100%;
  min-width: 900px;
  max-width: 1600px;
  margin: auto;
  padding: 30px;
  
}

/* --------------- Buttons --------------- */
.lightBtn {
  border: none;
  background-color: #d2e8eb;
  color: #193439;
  transition: linear 0.2s;
}

.lightBtn:hover {
  border: 4px solid #d2e8eb;
  background-color: #68b2bd;
  color: white;
}

.darkBtn {
  border: none;
  background-color: #68b2bd;
  color: white;
  transition: linear 0.2s;
}

.darkBtn:hover {
  border: 4px solid #68b2bd;
  background-color: #d2e8eb;
  color: #193439;
}

/* --------------- Nav Menu --------------- */
.nav_menu {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.nav_menu_block {
  display: flex;
  align-items: center;
}

/* ----- Nav Menu Buttons ----- */
.header_btns {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 150px;
  height: 50px;
  font-weight: 600;
  font-family: "Inter", sans-serif;
  font-size: 30px;
  border-radius: 25px 25px 25px 25px;
}

.log_in {
  margin-right: 20px;
}

.logo_text {
  font-family: "Josefin Sans", sans-serif;
  font-weight: 700;
  font-size: 50px;
  margin-left: 30px;
  color: #193439;
}

.header_hero {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 400px 400px;
  margin-top: 50px;
}

.header_hero_img {
  width: 800px;
  grid-column: 2;
  grid-row: 1/3;
}

.header_tagline {
  font-size: 130px;
  font-weight: 400;
  font-family: "Bebas Neue", sans-serif;
  align-self: end;
  color: #193439;
  line-height: 110px;
  margin-bottom: 20px;
}

.student {
  margin-top: 30px;
  grid-column: 1/2;
  grid-row: 2/3;
}
.university {
  grid-column: 1/2;
  grid-row: 2/3;
  justify-self: end;
  margin: 180px 40px 0 0;
}
.long_button {
  width: 400px;
  height: 100px;
  font-size: 30px;
  font-weight: 600;
  font-family: "Inter", sans-serif;
  border-radius: 50px;
}
/*---------------Main----------*/
.main_hero {
  width: 100%;
  display: grid;
  /* grid-template-columns:  51% 51% ; */
  grid-template-columns: 755px 755px;
  grid-template-rows: 150px 650px 240px;
}

.main_tagline {
  z-index: 2;
  font-size: 75px;
  font-weight: 400;
  font-family: "Bebas Neue", sans-serif;
  text-align: center;
  color: #193439;
  margin-bottom: 30px;
  margin-top: 30px;
  line-height: 90px;
  text-decoration: underline 5px;
  text-underline-offset: 15px;

  grid-column: 1/3;
  grid-row: 1;
}
.main_text {
  font-family: "Inter", sans-serif;
  font-size: 20px;
  font-weight: 400;
  text-align: center;
  grid-column: 1/3;
  grid-row: 2;
  z-index: 2; /* Нижний слой */
  line-height: 29px;
}
.background_circle {
  position: absolute;
  z-index: 1; /* Нижний слой */
  width: 800px;
  height: 800px;
  grid-column: 1/2;
  grid-row: 1/3;
}
.medium_circle {
  width: 500px;
  height: 500px;
  grid-column: 1/2;
  grid-row: 2/4;
  z-index: 3;
  align-self: end;
  margin-left: 30px;
  margin-bottom: -20px;
}
.small_circle {
  width: 350px;
  height: 350px;
  grid-column: 1/3;
  grid-row: 2/3;
  z-index: 3;
  margin: auto;
  margin-bottom: 40px;
}
.big_circle {
  width: 550px;
  height: 550px;
  grid-column: 2/3;
  grid-row: 2/4;
  z-index: 3;
  margin: end;
  margin-top: 300px;
  margin-left: 204px;
}
/*----------------Second_Page----------------*/

.content-block {
  padding: 30px;
  display: inline-block;

  border-color: #68b2bd;
  border-width: 8px;
  border-radius: 50px;
  border-style: solid;
  box-sizing: border-box;
  line-height: 29px;
  font-family: "Inter", sans-serif;
  font-size: 20px;
  font-weight: 400;
  color: #193439;
  margin-right: 50px;
}
/*____________*/

.blocks-finance {
  display: inline;
  width: 350px;
  height: 750px;
  grid-column: 1/2;
  grid-row: 2/4;
  align-self: end;
}
.blocks-finance h2 {
  font-size: 29px;
  font-weight: 600;
  text-align: center;
}
.blocks-finance p {
  text-align: center;
}
.blocks-finance img {
  width: 290px;
  height: 290px;
  margin-top: 10px;
  margin-bottom: 30px;
  margin-left: -10px;
  align-items: center;
}
/*____________*/

.blocks-education {
  z-index: 2;
  display: inline;
  width: 520px;
  height: 350px;
  grid-column: 2/3;
  grid-row: 2/3;
  align-self: center;
  margin-left: -345px;
  margin-top: -20px;
  /* overflow: auto; */
}
.blocks-education img {
  width: 150px;
  height: 150px;
  float: left;
  margin: 0 20px 20px 0;
}
.blocks-education h2 {
  font-size: 29px;
  font-weight: 600;
  margin-left: 170px;
}
.blocks-education p {
  text-align: top;
  margin-top: 10px;
}

/*____________*/

.blocks-doctor {
  z-index: 2;
  display: inline;
  width: 1100px;
  height: 350px;
  grid-column: 2/3;
  grid-row: 3/4;
  align-self: center;
  margin-left: -345px;
  margin-top: -109px;
}
.blocks-doctor img {
  width: 290px;
  height: 290px;
  margin-top: -8px;
}
.blocks-doctor h2 {
  margin-top: -290px;
  /* text-align: right; */
  margin-left: 322px;
}
.blocks-doctor p {
  margin-left: 322px;
  margin-top: 30px;
}
/*____________*/

.blocks-immigrants {
  z-index: 2;
  display: inline;
  width: 520px;
  height: 350px;
  grid-column: 3/4;
  grid-row: 2/3;
  align-self: center;
  margin-left: -520px;
  margin-top: -20px;
}
.blocks-immigrants img {
  width: 150px;
  height: 150px;
  float: left;
  margin: 0 20px 20px 0;
}
.blocks-immigrants p {
  margin-top: 10px;
}

/*-------------------*/
.background_circle2 {
  z-index: 1;
  /* Нижний слой */
  width: 800px;
  height: 800px;
  grid-column: 2/3;
  grid-row: 2/4;
  margin-top: 120px;
}

/*-----------How_Does_This_Work-----*/

.longest_Btn {
  width: 800px;
  height: 100px;
  border-radius: 50px;
  font-size: 30px;
  font-weight: 600;
  font-family: "Inter", sans-serif;
  display: flex;
  justify-content: center;
  align-items: center;
}

.DLST{
  grid-column: 2/3;
  grid-row: 2/3;
  margin-left: -300px;
}
.LLST{
  grid-column: 1/2;
  grid-row: 2/3;
  margin-bottom: 90px;
  margin-left: 240px;
  align-self: end;
}
.left_text{
  grid-column: 2/3;
  grid-row: 2/3;
  text-align: center;
  margin-top: 120px;
  margin-left: -330px;
  margin-right: 220px;
  border-width: 0px;
  line-height: 29px;
}
.right_text{
  grid-column: 1/2;
  grid-row: 3/4;
  text-align: center;
  align-self: left;
  margin-left:200px;
  margin-right: -320px;
  margin-top: -80px;
  border-width: 0px;
}
.How1{
  width: 400px;
  height: 400px;
  grid-column: 1/2;
  grid-row: 2/3;
}
.How2{
  width: 400px;
  height: 400px;
  grid-column: 2/3;
  grid-row: 2/3;
  /* align-self: end; */
  margin-left: 355px;
  margin-top: 390px;
}

/*--------Footer---------*/

.footer_hero{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 180px;
  width: 1200px
  
}

.links{
  grid-column: 1/2;
  grid-row: 1/2;
  text-align: left;
  color:#193439;
  line-height: 25px;
  z-index: 2;
}
.directed_by{
  grid-column: 2/3;
  grid-row: 1/2;
  text-align: left;
  color:#193439;
  line-height: 25px;
  z-index: 2;
}
.credits{
  grid-column: 3/4;
  grid-row: 1/2;
  text-align: left;
  color:#193439;
  margin-right: -50px;
  line-height: 25px;
} /* TODO: I DO NOT KNOW WHAT TO DO*/
.sep{
  width: 1px;
  height: 122px;
  background-color: #193439;
  z-index: 2;
}
.first_sep{
  grid-row: 1/2;
  grid-column: 2;
  margin-left: -98px;
  z-index: 2;
}
.second_sep{
  grid-row: 1/2;
  grid-column: 3;
  margin-left: -98px;
}
.background_half_circle{
  height: 600px;
  width: 600px;
  background-color: #d2e8eb;
  z-index: 1;
  margin-left: 1900px;
  margin-top: -330px;
  clip-path: circle(40%);
}